function Banners() {

}

/**
 * 点击添加轮播图按钮在前段添加一项空的轮播图
 */
Banners.prototype.listenAddBannerEvent = function () {
    var addBtn = $('.add-banner-btn');
    var self = this;
    addBtn.click(function () {
        self.createBanner();
    });
};

/**
 * 添加图片上传事件
 * @param bannerItem
 */
Banners.prototype.addImageSelectEvent = function (bannerItem) {
    var image = bannerItem.find('.thumbnail');
    //图片是不能打开文件选择框的，必须通过input
    var imageInput = bannerItem.find('.image-input');
    image.click(function () {
        imageInput.click();
    });

    imageInput.change(function () {
        window.messageBox.showInfo('开始上传图片');
        var formData = new FormData();
        myajax.post({
            url: '/cms/juhesign/',
            success: function (result) {
                if (result['code'] === 200) {
                    var file = imageInput[0].files[0];
                    var data = result['data'];
                    formData.append('file', file);
                    formData.append('sign', data['sign']);
                    formData.append('id', data['id']);
                    formData.append('ts', data['ts']);

                    $.post({
                        url: 'https://api.superbed.cn/upload',
                        data: formData,
                        /*上传文件需指定以下两个*/
                        processData: false,
                        contentType: false,
                        success: function (result) {
                            if (result['err'] === 0) {
                                image.attr('src', result['url']);
                                window.messageBox.showSuccess('上传图片成功');
                            } else {
                                linalert.alertErrorToast('上传失败，请重试');
                            }
                        }
                    });
                }
            }
        });
    });
};

/**
 * 添加删除轮播图事件
 * @param bannerItem
 */
Banners.prototype.addRemoveBannerEvent = function (bannerItem) {
    var btn = bannerItem.find('.close-btn');
    btn.click(function () {
        var bannr_id = bannerItem.attr('data-banner-id');
        if (banner_id) {
            linalert.alertConfirm({
                text: '您确定要删除这个轮播图吗',
                confirmCallback: function () {
                    myajax.post({
                        url: '/cms/delete_banner/',
                        data: {
                            banner_id
                        },
                        success: function (result) {
                            if (result['code'] === 200) {
                                bannerItem.remove();
                                window.messageBox.showSuccess('删除成功');
                            }
                        }
                    });
                }
            });
        } else {
            bannerItem.remove();
        }
    });
};

/**
 * 添加保存轮播图事件
 * @param bannerItem
 */
Banners.prototype.addSaveBannerEvent = function (bannerItem) {
    var saveBtn = $('.save-btn');
    var self = this;
    var imageTag = bannerItem.find('.thumbnail');
    var priorityTag = bannerItem.find('input[name="priority"]');
    var linkToTag = bannerItem.find('input[name="link_to"]');
    var prioritySpan = bannerItem.find('span[class="priority"]');
    saveBtn.click(function () {
        var image_url = imageTag.attr('src');
        var priority = priorityTag.val();
        var link_to = linkToTag.val();
        myajax.post({
            url: '/cms/add_banner/',
            data: {
                image_url,
                priority,
                link_to
            },
            success: function (result) {
                if (result['code'] === 200) {
                    var banner_id = result['data']['banner_id'];
                    bannerItem.attr('data-banner-id', banner_id);
                    window.messageBox.showSuccess('添加轮播图成功');
                    saveBtn.unbind('click');
                    self.addEditBannerEvent(bannerItem);
                    prioritySpan.text(priority);
                    saveBtn.text('修改');

                }
            }
        })
    });
};

/**
 * 添加编辑轮播图事件
 * @param bannerItem
 */
Banners.prototype.addEditBannerEvent = function (bannerItem) {
    var saveBtn = $('.save-btn');
    var imageTag = bannerItem.find('.thumbnail');
    var priorityTag = bannerItem.find('input[name="priority"]');
    var linkToTag = bannerItem.find('input[name="link_to"]');
    var prioritySpan = bannerItem.find('span[class="priority"]');
    var self = this;
    var banner_id = bannerItem.attr('data-banner-id');
    if (!banner_id) {
        return;
    }
    saveBtn.click(function () {
        var image_url = imageTag.attr('src');
        var priority = priorityTag.val();
        var link_to = linkToTag.val();
        myajax.post({
            url: '/cms/edit_banner/',
            data: {
                pk: banner_id,
                image_url,
                priority,
                link_to
            },
            success: function (result) {
                if (result['code'] === 200) {
                    window.messageBox.showSuccess('轮播图修改成功');
                    prioritySpan.text(priority);
                }
            }
        });
    });
};

/**
 * 创建一个新的轮播图
 * @param banner
 */
Banners.prototype.createBanner = function (banner) {
    var self = this;
    var tpl = template('banner-item', {banner});
    var bannerListGroup = $('.banner-list-group');
    var bannerItem = undefined;
    if (banner) {
        bannerListGroup.append(tpl);
        bannerItem = bannerListGroup.find('.banner-item:last');
        self.addEditBannerEvent(bannerItem);
    } else {
        bannerListGroup.prepend(tpl);
        bannerItem = bannerListGroup.find('.banner-item:first');
        self.addSaveBannerEvent(bannerItem);
    }
    self.addImageSelectEvent(bannerItem);
    self.addRemoveBannerEvent(bannerItem);
};

/**
 * 加载所有的轮播图
 */
Banners.prototype.loadData = function () {
    var self = this;
    myajax.get({
        url: '/cms/banner_list/',
        success: function (result) {
            if (result['code'] === 200) {
                var banners = result['data'];
                for (var i = 0; i < banners.length; i++) {
                    var banner = banners[i];
                    self.createBanner(banner);
                }
            }
        }
    });
};

/**
 * 入口
 */
Banners.prototype.run = function () {
    this.loadData();
    this.listenAddBannerEvent();
};

$(function () {
    var b = new Banners();
    b.run();
});
